<template>

<section class="container">
  <div class="col-md-5">
    <form @submit.prevent="Editing">
      <div class="form-group">
        <label for="exampleInputEmail1">账号</label>
        <p class="form-control-static">{{UserData.username}}</p>
      </div>
      <div class="form-group">
        <label for="exampleInputPassword1">昵称</label>
        <input type="text" class="form-control" v-model="UserData.nickname" id="exampleInputPassword1" placeholder="">
      </div>
      <div class="form-group">
        <label for="exampleInputPassword1">性别</label>
        <div>
          <label class="radio-inline">
            <input type="radio" name="inlineRadioOptions" id="inlineRadio1" value="1" v-model="UserData.gender"> 男
          </label>
          <label class="radio-inline">
            <input type="radio" name="inlineRadioOptions" id="inlineRadio2" value="0" v-model="UserData.gender"> 女
          </label>
          <label class="radio-inline">
            <input type="radio" name="inlineRadioOptions" id="inlineRadio3" value="2" v-model="UserData.gender"> 保密
          </label>
        </div>
      </div>
      <button type="submit" class="btn btn-success">保存</button>
    </form>
  </div>
</section>

</template>

<script>
  import axios from 'axios'
  export default {
    data () {
      return {
        UserData: {},

      }
    },
    created () {
      this.DataShow()
    },
    methods: {
      async DataShow () {
        try {
         const {data} =  await axios.get('/api/session')
         this.UserData = data
        } catch(e) {
          console.log(e);
        }
      },
      async Editing () {
        const {id, gender, nickname} = this.UserData
        console.log(id)
        console.log(gender)
        console.log(nickname)
        try {
          const {data} =  await axios.patch(`/api/users/${id}`,{gender, nickname})
          console.log(data)
          const user =  await axios.patch(`/api/session`,data)
          alert('修改成功')
          console.log(user)
        } catch(e) {
          // statements
          console.log(e);
        }

      }
    }
  }
</script>

